<template>
  <div class="news_detail">
    <QxHead @showModal="showMenuModal"/>
    <Menu :showModal="showModalFlag" @handleHideModal="handleHideModal" @getMenuList="getMenuList"/>
    <div class="news_content">
      <div class="title">{{detail.title}}</div>
      <div class="second_title">
        {{_getTime(detail.create_time)}} | 浏览次数：{{detail.read_num}}
      </div>
      <div class="content_box" v-html="detail.content">

      </div>
      <div class="btn-back">
        <a @click="$router.back()">返回列表页</a>
      </div>
    </div>
  </div>
</template>
<script>
	var _hmt = _hmt || [];
	(function() {
		var hm = document.createElement("script");
		hm.src = "https://hm.baidu.com/hm.js?0c6b7133f8b076c80f30ef205bddbfab";
		var s = document.getElementsByTagName("script")[0];
		s.parentNode.insertBefore(hm, s);
	})();
  import QxHead from "./common/qxHead";
  import Menu from "./common/menu";

  let CONSTANT = require('../../wechat/static/constant/constant.js'),
    common = require("../../wechat/static/common/common.js")

  export default {
    components: {
      QxHead,
      Menu
    },
    data() {
      return {
        showModalFlag: false,
        detail: {}
      }
    },
    mounted() {
      this.getNewsDetail(this.$route.query.id)
    },
    methods: {
      getMenuList(data) {
//        data.map( item => {
//          if (item.link == location.pathname) {
//            this.bannerImage = "https://qiaoxin.oss-cn-shenzhen.aliyuncs.com"+item.banner_image
//          }
//        })
      },
      getNewsDetail(id) {
        let url = CONSTANT.URL.getNewsDetail;
        common.requestGetAjax(url, {}, {id: id}, (res) => {
          if (res.code == 200) {
            this.detail = res.data
          }
        })
      },
      showMenuModal(bool) {
        this.showModalFlag = bool
      },
      handleHideModal(bool) {
        this.showModalFlag = bool
      },
      _getTime(stamp) {
        return common.timeStampToDate(stamp)
      }
    }
  };
</script>
<style lang="less">
  .news_detail {
    .news_content {
      margin: .33rem .3rem .26rem .3rem;
      .title {
        font-size: .38rem;
        margin-bottom: .26rem;
      }
      .second_title {
        color: #aaa;
        font-size: .21rem;
      }
      .content_box {
        padding: .35rem 0;
        p, div {
          font-size: .29rem!important;
          span {
            font-size: .29rem!important;
          }
          img {
            width: 100%!important;
          }
          iframe {
            width: 100%;
          }
        }
      }
      .btn-back {
        width: 3.25rem;
        height: .82rem;
        line-height: .82rem;
        height: .82rem;
        text-align: center;
        margin: 0 auto;
        font-size: .29rem;
        background-color: #F2F2F2;
        border-radius: .41rem;
        a {
          color: #999;
        }
      }
    }
  }
</style>

